import React, { Component } from "react";

import { connect } from "react-redux";
import { loadAction } from "./store/actionCreator";

import Form from "./Form";
import List from "./List";
import Count from "./Count";

const mapDispatchToProps = (dispatch) => {
  return {
    load() {
      dispatch(loadAction());
    },
  };
};

@connect(null, mapDispatchToProps)
class App extends Component {
  componentDidMount() {
    this.props.load();
  }

  render() {
    return (
      <>
        <h2>async-redux-todolist</h2>
        <Count />

        <hr />

        <Form />
        <List />
      </>
    );
  }
}

export default App;
